<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:include page="../../base/header.jsp"></jsp:include>
<link rel="stylesheet" type="text/css" href="static/plugins/webuploader/css/webuploader.css" />
<link rel="stylesheet" type="text/css" href="static/plugins/webuploader/image-upload/style.css" />
<link rel="stylesheet" type="text/css" href="static/plugins/zTree/css/zTreeStyle/zTreeStyle.css" />
<style>
	.modal-backdrop{
		z-index:899;
	}
</style>
<body style="background-color:#FFF;">
	<div class="page-header">
		<h1>
			新闻管理
			<small>
				<i class="icon-double-angle-right"></i>
				新闻资讯管理
			</small>
		</h1>
	</div>
	<div class="row" style="width: 100%;">
		<div class="col-xs-2">
			<ul id="treeDemo" class="ztree"></ul>
		</div>
		<div class="col-xs-10">
			<div class="table-responsive">
				<table id="sample-table-1" class="table table-striped table-bordered table-hover">
					<thead>
						<tr>
							<th class="center">
								<label>
									<input type="checkbox" class="ace"/>
									<span class="lbl"></span>
								</label>
							</th>
							<th>标题</th>
							<th>发布时间</th>
							<th>发布人</th>
							<th>浏览数量</th>
							<th>点赞数量</th>
							<th>评论数量</th>
							<th></th>
						</tr>
					</thead>
					<tbody>
						
					</tbody>
				</table>
			</div><!-- /.table-responsive -->
			<div class=" no-margin-top">
				<ul class="pagination pull-right no-margin">
					
				</ul>
			</div>
			<button class="single-add btn btn-primary btn-xs">
				<i class="icon-edit bigger-160 icon-only" href="#modal-table" data-toggle="modal"></i>
			</button>
			<button class="batch-del btn btn-danger btn-xs">
				<i class="icon-trash bigger-160 icon-only"></i>
			</button>
			<div id="modal-table" class="modal fade" tabindex="-1" style="z-index:900;display:block">
				<div class="modal-dialog" style="width:900px">
					<div class="modal-content">
						<div class="modal-header no-padding">
							<div class="table-header">
							</div>
						</div>
						<div class="modal-body no-padding">
							<form class="form-horizontal" role="form" style="margin-top:2rem;">
								<div id="modal-table-container"></div>
								<div class="space-4"></div>
								<div class="form-group">
									<label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 新闻封面 </label>
									<div class="col-sm-10">
										<div id="wrapper" class="no-margin">
									        <div id="container" class="uploader-container col-xs-10 col-sm-11 no-padding" style="padding-bottom: 10px !important;">
									            <div id="uploader">
									            	<input type="hidden" for-format="empty-uploader" />
									            	<input type="hidden" for-format="reload-uploader"  url="news/detail" delUrl="news/del/pic" v="0"/>
									                <div class="queueList">
									                    <div id="dndArea" class="placeholder">
									                        <div id="filePicker"></div>
									                    </div>
									                    
									                </div>
									                <div class="statusBar" style="display:none;">
									                    <div class="info"></div>
									                </div>
									            </div>
									        </div>
									    </div>
									</div>
								</div>
								<div class="space-4"></div>
								<div class="form-group">
									<label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 新闻内容 </label>
									<div class="col-sm-10">
										<input type="hidden" for-format="rich-text"  name="content" value="" />
										<script id="editor" type="text/plain" class="col-sm-11 no-padding"></script>
									</div>
								</div>
								<div id="modal-table-btn"></div>
							</form>
						</div>
						<div class="modal-footer no-margin-top"></div>
					</div>
				</div>
			</div>
		</div><!-- /span -->
	</div>
	<script src="static/assets/js/bootbox.min.js"></script>
	<script src="static/assets/js/jquery.gritter.min.js"></script>
	<script src="static/assets/js/fuelux/fuelux.tree.min.js"></script>
	<script src="static/plugins/system-plugins.js"></script>
	<script type="text/javascript" src="static/plugins/webuploader/dist/webuploader.js"></script>
	<script type="text/javascript" src="static/plugins/webuploader/upload.news.js"></script>
	<script type="text/javascript" charset="utf-8" src="static/plugins/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="static/plugins/ueditor/ueditor.all.min.js"> </script>
    <script type="text/javascript" charset="utf-8" src="static/plugins/ueditor/lang/zh-cn/zh-cn.js"></script>
	<script type="text/javascript" src="static/plugins/zTree/js/jquery.ztree.all.min.js"></script>
	<script type="text/javascript">
	$(function(){
		setTimeout(function(){
			$("#modal-table").css("display","none");
		},100);
		var ue = UE.getEditor('editor');
		var names = [
 			{
 				name:'id',
 				type:'main',
 				input:'新闻'
 			},
 			{
 				name:function(index,value,isForInput){
 					if(isForInput)return 'columnName';
 					return '<td value="' + value.columnId + '">' + value.columnName + '</td>';
 				},
 				input:function(value,isInit,isChar){
 					if(isChar)return '新闻栏目';
 					if(isInit)return '<div class="col-sm-10"><input type="hidden" for-type="combox-select" data-v="id" data-t="columnName" url="news/col/all" name="columnId" value="" /></div></div>';
 					return '<div class="col-sm-10"><input type="hidden" for-type="combox-select" url="news/col/all" data-v="id" data-t="columnName" name="columnId" value="' + value.columnId + '" /></div></div>';
 				},
 				isTd:false,
 				size:'L'
 			},
 			{
 				name:'title',
 				input:'标题',
 				size:'L'
 			},
 			{
 				name:'publishTime',
 				type:'hidden',
 				isTd:true
 			},
 			{
 				name:'publisher',
 				type:'hidden',
 				isTd:true
 				
 			},
 			{
 				name:'viewCount',
 				type:'hidden',
 				isTd:true
 			},
 			{
 				name:'likedCount',
 				type:'hidden',
 				isTd:true
 			},
 			{
 				name:'reviewCount',
 				type:'hidden',
 				isTd:true
 			},
 			{
 				name:'content',
 				isTd:false
 			}
 		];
 		var parms = {
 			pageNum:1,
 			pageSize:4
 		};
 		var urls = {
 			load:'news/info',
 			detail:'news/detail',
 			del:'news/del',
 			edit:'news/upd',
 			add:'news/add',
 			delBatch:'news/delall',
 		};
 		var config = {
 			ueditor:true,
 			uploader:true
 		};
 		$.loadTbl(names,parms,urls,config,true);
 		
 		// zTree init
 		
 		var setting = {
			async: {
				enable: true,
				url:"news/col/all",
				autoParam:["higherColumnId"],
				otherParam:{},
				dataFilter: filter
			},
			data:{
				key:{
					name:'columnName'
				},
				simpleData:{
					enable: true,
					idKey: "id",
					pIdKey: "higherColumnId",
					rootPId: 0
				}
			},
			callback:{
				onClick:function(event,treeId,treeNode,clickFlag){
					if(treeNode.check_Child_State == -1){
						var parms = {
					 			pageNum:1,
					 			pageSize:4,
					 			zTree:{
					 				name:'columnId',
					 				value:treeNode.id
					 			}
					 	};
						$.loadTbl(names,parms,urls,config,true);
					}
				}
			}
		};

		function filter(treeId, parentNode, childNodes) {
			return childNodes.obj;
		}
		
		$.fn.zTree.init($("#treeDemo"), setting);
        //var zTreeObj = $.fn.zTree.init($("#zTree"),setting); 
        //让第一个父节点展开
        //var rootNode_0 = zTreeObj.getNodeByParam('pid',0,null);
        //zTreeObj.expandNode(rootNode_0, true, false, false, false);
 			
		$('table th input:checkbox').on('click' , function(){
			var that = this;
			$(this).closest('table').find('tr > td:first-child input:checkbox')
			.each(function(){
				this.checked = that.checked;
				if(that.checked == true)$(this).closest('tr').addClass('selected');
				else $(this).closest('tr').removeClass('selected');
			});
				
		});
		$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
		function tooltip_placement(context, source) {
			var $source = $(source);
			var $parent = $source.closest('table')
			var off1 = $parent.offset();
			var w1 = $parent.width();
	
			var off2 = $source.offset();
			var w2 = $source.width();
	
			if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
			return 'left';
		}
	});
	</script>
</body>